.stakeNumPanel {
  height: 45px;
  left: @SYSMARGINLEFTPANEL;
  right: @SYSMARGINRIGHTPANEL;
  .grid {
    .abs;
    top: 0;
    left: 15px;
    right: 15px;
    height: 45px;
    .rule {
      height: 5px;
      .abs;
      .nosel;
      opacity: 0.5;
      left: 0;
      right: 0;
      top: 20px;
      border-bottom: 1px solid white;
      display: flex;
      .ruleNode {
        height: 5px;
        border-right: 1px solid white;
        flex: 1;
        &:last-child {
          border-right: none;
        }
      }
    }
    .node {
      .abs;
      .nosel;
      opacity: 0.5;
      width: 0;
      height: 0;
      overflow: visible;
      top: 24px;
      .point {
        @size: 6px;
        width: @size;
        height: @size;
        .abs;
        border-radius: @size;
        transform: translate(-50%, -50%);
        border: 1px solid black;
        background-color: white;
      }
      .line {
        .abs;
        left: 0;
        bottom: 0;
        height: 10px;
        border-left: 2px solid white;
        transform: translateX(-50%);
      }
      .label {
        .abs;
        transform: translateX(-50%);
        top: 0;
        font-size: 12px;
        color: white;
      }
      &.start {
        right: 0;
        .label {
          transform: translateX(-100%);
        }
      }
      &.stop {
        left: 0;
        .label {
          transform: translateX(0);
        }
      }
      &.current {
        opacity: 0;
        @color:yellow;
        .label {
          color: @color;
        }
        .point {
          background-color: @color;
        }
        .line {
          height: 15px;
          border-left: 2px solid @color;
        }
      }
      &.viewport {
        @color: #00ff00;

        opacity: 1;
        .animation;
        .label {
          color: @color;
        }
        .point {
          background-color: @color;
        }
        .line {
          height: 15px;
          border-left: 2px solid @color;
        }
      }
    }
    &:hover {
      .node {
        &.current {
          opacity: 1;
        }
        &.viewport {
          opacity: 0.5;
        }
      }
    }
  }
}